<template>
    <Repl :store="store" :showCompileOutput="false" />
</template>
<script setup>
import '@vue/repl/style.css'
import { Repl, ReplStore } from '@vue/repl'
import { watchEffect } from 'vue'

// const props = defineProps({
//     /**内容 */
//     code: {
//         type: [String],
//         default: ''
//     },
// })
const store = new ReplStore({
    serializedState: location.hash.slice(1),
    outputMode: 'preview',
})


let renderCode = (code) => {
    store.setFiles(
        {
            'App.vue': `${code}`
        },
    )
    watchEffect(() => history.replaceState({}, '', store.serialize()))
}

defineExpose({ renderCode })
</script>

